
<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title></title>

        <!-- Required CSS files -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i" rel="stylesheet">
    <link rel="stylesheet" href="assets/css/owl.carousel.css">
    <link rel="stylesheet" href="assets/css/barfiller.css">
    <link rel="stylesheet" href="assets/css/animate.css">
    <link rel="stylesheet" href="assets/css/font-awesome.min.css">
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/slicknav.css">
    <link rel="stylesheet" href="assets/css/main.css">
</head>

<body>
    <div class="preloader">
        <span class="preloader-spin"></span>
    </div>
    <div class="site">
        

        
                <header>
            <div class="container">
                <div class="row">
                    <div class="col-6 col-sm-3 logo-column">
                        <a href="index.html" class="logo">
                            <img src="assets/img/logo.png" alt="logo">
                        </a>
                    </div>
                    <div class="col-6 col-sm-9 nav-column clearfix">
                        <div class="right-nav">
                            <span class="search-icon fa fa-search"></span>
                            <form action="#" class="search-form">
                                <input type="search" placeholder="search now">
                                <button type="submit"><i class="fa fa-search"></i></button>
                            </form>
                            <div class="header-social">
                                <a href="#" class="fa fa-facebook"></a>
                                <a href="#" class="fa fa-twitter"></a>
                                <a href="#" class="fa fa-github"></a>
                            </div>
                        </div>
                        <nav id="menu" class="d-none d-lg-block">
                            <ul>
                                <li class="current-menu-item has-child">
                                    <a href="index.html">Home</a>
                                    <ul class="sub-menu">
                                        <li><a href="index.html">Home - 01</a></li>
                                        <li><a href="index-2.html">Home - 02</a></li>
                                        <li><a href="index-3.html">Home - 03</a></li>
                                    </ul>
                                </li>
                                <li><a href="about.html">About</a></li>
                                <li><a href="portfolio.html">Portfolio</a></li>
                                <li class="has-child">
                                    <a href="#">Pages</a>
                                    <ul class="sub-menu">
                                        <li><a href="404.html">404</a></li>
                                        <li><a href="about.html">About</a></li>
                                        <li><a href="career.html">Career</a></li>
                                        <li><a href="coming-soon.html">Coming Soon</a></li>
                                        <li><a href="contact.html">Contact</a></li>
                                        <li><a href="faq.html">Faq</a></li>
                                        <li><a href="portfolio.html">Portfolio</a></li>
                                        <li><a href="pricing.html">Pricing</a></li>
                                        <li><a href="service.html">Service</a></li>
                                        <li><a href="team.html">Team</a></li>
                                        <li><a href="testimonial.html">Testimonial</a></li>
                                    </ul>
                                </li>
                                <li><a href="contact.html">Contact</a></li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </header>                <div class="hero-slider">
            <div class="single-slide" style="background-image: url(assets/img/slide1.jpg)">
                <div class="inner">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="slide-content">
                                    <h2>We Are Digital Product Design Agency.</h2>
                                    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
                                    <div class="slide-btn">
                                        <a href="#" class="button">Learn More</a>
                                        <a href="#" class="button-2">Live Preview</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="single-slide" style="background-image: url(assets/img/slide2.jpg)">
                <div class="inner">
                    <div class="container">
                        <div class="row justify-content-center">
                            <div class="col-lg-6 text-center">
                                <div class="slide-content">
                                    <h2>We Are Digital Product Design Agency.</h2>
                                    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
                                    <div class="slide-btn">
                                        <a href="#" class="button">Learn More</a>
                                        <a href="#" class="button-2">Live Preview</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="single-slide" style="background-image: url(assets/img/slide3.jpg)">
                <div class="inner">
                    <div class="container">
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="slide-content">
                                    <h2>We Are Digital Product Design Agency.</h2>
                                    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
                                    <div class="slide-btn">
                                        <a href="#" class="button">Learn More</a>
                                        <a href="#" class="button-2">Live Preview</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6 text-center">
                                <div class="inner embed-responsive embed-responsive-16by9" data-margin="25px 0 0">
                                    <iframe width="560" height="315" src="https://www.youtube.com/embed/GYtUAYYDPo0?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>        <div class="service-area spt">
    <div class="container">
        <div class="section-title" data-margin="0 0 40px">
            <h2>Our Service</h2>
            <p>Malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae.</p>
        </div>
        <div class="row">
            <div class="col-md-4 single-service-2">
                <div class="inner">
                    <div class="title">
                        <div class="icon">
                            <i class="fa fa-film"></i>
                        </div>
                        <h4>Video Making</h4>
                    </div>
                    <div class="content">
                        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames.</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 single-service-2">
                <div class="inner">
                    <div class="title">
                        <div class="icon">
                            <i class="fa fa-camera"></i>
                        </div>
                        <h4>Photography</h4>
                    </div>
                    <div class="content">
                        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames.</p>
                    </div>
                </div>
            </div>
            <div class="col-md-4 single-service-2">
                <div class="inner">
                    <div class="title">
                        <div class="icon">
                            <i class="fa fa-music"></i>
                        </div>
                        <h4>Music Composing</h4>
                    </div>
                    <div class="content">
                        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>        <div class="portfolio-area sp">
    <div class="container">
        <div class="section-title">
            <h2>Latest Work</h2>
            <p>Malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae.</p>
        </div>
        <div class="row">
            <div class="single-portfolio col-md-4">
                <div class="inner">
                    <div class="portfolio-img">
                        <img src="assets/img/portfolio1.jpg" alt="portfolio-image">
                        <div class="hover-content">
                            <div>
                                <a href="#" class="button">View Case Study</a>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-content">
                        <a href="#"><h3>The Back Chiropractor</h3></a>
                        <span>Ceramics, Design</span>
                    </div>
                </div>
            </div>
            <div class="single-portfolio col-md-4">
                <div class="inner">
                    <div class="portfolio-img">
                        <img src="assets/img/portfolio2.jpg" alt="portfolio-image">
                        <div class="hover-content">
                            <div>
                                <a href="#" class="button">View Case Study</a>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-content">
                        <a href="#"><h3>The Back Chiropractor</h3></a>
                        <span>Ceramics, Design</span>
                    </div>
                </div>
            </div>
            <div class="single-portfolio col-md-4">
                <div class="inner">
                    <div class="portfolio-img">
                        <img src="assets/img/portfolio3.jpg" alt="portfolio-image">
                        <div class="hover-content">
                            <div>
                                <a href="#" class="button">View Case Study</a>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-content">
                        <a href="#"><h3>The Back Chiropractor</h3></a>
                        <span>Ceramics, Design</span>
                    </div>
                </div>
            </div>
            <div class="single-portfolio col-md-4">
                <div class="inner">
                    <div class="portfolio-img">
                        <img src="assets/img/portfolio4.jpg" alt="portfolio-image">
                        <div class="hover-content">
                            <div>
                                <a href="#" class="button">View Case Study</a>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-content">
                        <a href="#"><h3>The Back Chiropractor</h3></a>
                        <span>Ceramics, Design</span>
                    </div>
                </div>
            </div>
            <div class="single-portfolio col-md-4">
                <div class="inner">
                    <div class="portfolio-img">
                        <img src="assets/img/portfolio5.jpg" alt="portfolio-image">
                        <div class="hover-content">
                            <div>
                                <a href="#" class="button">View Case Study</a>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-content">
                        <a href="#"><h3>The Back Chiropractor</h3></a>
                        <span>Ceramics, Design</span>
                    </div>
                </div>
            </div>
            <div class="single-portfolio col-md-4">
                <div class="inner">
                    <div class="portfolio-img">
                        <img src="assets/img/portfolio6.jpg" alt="portfolio-image">
                        <div class="hover-content">
                            <div>
                                <a href="#" class="button">View Case Study</a>
                            </div>
                        </div>
                    </div>
                    <div class="portfolio-content">
                        <a href="#"><h3>The Back Chiropractor</h3></a>
                        <span>Ceramics, Design</span>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-12 text-center" data-margin="40px 0 0">
                <a href="#" class="button">More Works</a>
            </div>
        </div>
    </div>
</div>        <div class="spb">
            <div class="brand-area">
    <div class="container">
        <div class="row">
            <div class="col-md-3 col-6 single-brand">
                <div class="inner">
                    <a href="#">
                        <img src="assets/img/brand1.png" alt="">
                    </a>
                </div>
            </div>
            <div class="col-md-3 col-6 single-brand">
                <div class="inner">
                    <a href="#">
                        <img src="assets/img/brand2.png" alt="">
                    </a>
                </div>
            </div>
            <div class="col-md-3 col-6 single-brand">
                <div class="inner">
                    <a href="#">
                        <img src="assets/img/brand3.png" alt="">
                    </a>
                </div>
            </div>
            <div class="col-md-3 col-6 single-brand">
                <div class="inner">
                    <a href="#">
                        <img src="assets/img/brand4.png" alt="">
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>        </div>
        <div class="tabs-area spb">
    <div class="container">
        <ul class="nav tabs-nav" id="pills-tab" role="tablist">
            <li class="nav-item">
                <a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#mission">
                    <i class="fa fa-puzzle-piece"></i>
                    <span>Our Missioin</span>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#vision">
                    <i class="fa fa-binoculars"></i>
                    <span>Our Vision</span>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#funds">
                    <i class="fa fa-pie-chart"></i>
                    <span>Investments & Fundings</span>
                </a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#history">
                    <i class="fa fa-qrcode"></i>
                    <span>Our History</span>
                </a>
            </li>

        </ul>
        <div class="tab-content" id="pills-tabContent">
            <div class="tab-pane fade show active" id="mission" role="tabpanel">
                <div class="row">
                    <div class="col-md-6">
                        <img src="http://lorempicsum.com/simpsons/490/200/2" alt="">
                    </div>
                    <div class="col-md-6">
                        <p>When I was just starting 6th grade I got my first job. Paperboy! Boy, was I excited. At that time I had spent a lot of time actually playing the video official game Paperboy disked.</p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. You would need to research online, for newspapers that are in your area.</p>
                    </div>
                </div>
            </div>
            <div class="tab-pane fade" id="vision" role="tabpanel">
                    <div class="row">
                        <div class="col-md-6">
                            <p><strong>When I was just starting 6th grade I got my first job. Paperboy! Boy, was I excited. At that time I had spent a lot of time actually playing the video official game Paperboy disked.</strong></p>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</p>
                        </div>
                        <div class="col-md-6">
                            <p>When I was just starting 6th grade I got my first job. Paperboy! Boy, was I excited. At that time I had spent a lot of time actually playing the video official game Paperboy disked.</p>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. You would need to research online, for newspapers that are in your area.</p>
                        </div>
                    </div>
            </div>
            <div class="tab-pane fade" id="funds" role="tabpanel">
                    <div class="row">
                        <div class="col-md-6">
                            <p><strong>When I was just starting 6th grade I got my first job. Paperboy! Boy, was I excited. At that time I had spent a lot of time actually playing the video official game Paperboy disked.</strong></p>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</p>
                        </div>
                        <div class="col-md-6">
                            <img src="http://lorempicsum.com/simpsons/490/200/3" alt="">
                        </div>
                    </div>
            </div>
            <div class="tab-pane fade" id="history" role="tabpanel">
                <div class="row">
                    <div class="col-md-6">
                        <img src="http://lorempicsum.com/simpsons/490/100/3" alt="">
                        <br>
                        <br>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi utad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</p>
                    </div>
                    <div class="col-md-6">
                        <p><strong>When I was just starting 6th grade I got my first job. Paperboy! Boy, was I excited. At that time I had spent a lot of time actually playing the video official game Paperboy disked.</strong></p>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. You would need to research online, for newspapers that are in your area.</p>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>        <footer>
    <div class="footer-top">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-lg-3 footer_widget">
                    <div class="inner">
                        <h4>About</h4>
                        <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
                        <p>Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, antesenectus et netus et malesuada fames ac turpis egestas.</p>
                    </div>
                </div>
                <div class="col-md-6 col-lg-3 footer_widget">
                    <div class="inner">
                        <h4>Company</h4>
                        <ul>
                            <li><a href="#">Company Overview</a></li>
                            <li><a href="#">Meet The Team</a></li>
                            <li><a href="#">Our Awesome Partners</a></li>
                            <li><a href="#">Our Services</a></li>
                            <li><a href="#">Frequently Asked Questions</a></li>
                            <li><a href="#">Contact Us</a></li>
                            <li><a href="#">Terms of Use</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-md-6 col-lg-3 footer_widget">
                    <div class="inner">
                        <h4>Recent Posts</h4>
                        <div class="media">
                            <a href="#">
                                <img src="assets/img/recent1.jpg" class="d-flex mr-3" alt="">
                            </a>
                            <div class="media-body">
                                <h5>
                                    <a href="#">Curling irons are as individual as the women</a>
                                </h5>
                                <span>June 22, 2019</span>
                            </div>
                        </div>
                        <div class="media">
                            <a href="#">
                                <img src="assets/img/recent2.jpg" class="d-flex mr-3" alt="">
                            </a>
                            <div class="media-body">
                                <h5>
                                    <a href="#">Curling irons are as individual as the women</a>
                                </h5>
                                <span>June 22, 2019</span>
                            </div>
                        </div>
                        <div class="media">
                            <a href="#">
                                <img src="assets/img/recent3.jpg" class="d-flex mr-3" alt="">
                            </a>
                            <div class="media-body">
                                <h5>
                                    <a href="#">Curling irons are as individual as the women</a>
                                </h5>
                                <span>June 22, 2019</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-3 footer_widget">
                    <div class="inner">
                        <h4>Address</h4>
                        <h5>Flat Pro, Inc.</h5>
                        <p>649 Folsom Ave, Suite 400 <br>San Francisco, CA 63105 <br>P: (123) 456-7890</p>
                        <h4>Newsletter</h4>
                        <form action="#" class="nw_form">
                            <input placeholder="Enter your email" type="email">
                            <button><i class="fa fa-paper-plane"></i></button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer-bottom">
        <div class="container">
            <div class="row">
                <div class="col-lg-6">
                    <div class="copyright-txt">
                        Copyright &copy; 2019.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a>
                    </div>
                </div>
                <div class="col-lg-6 text-right">
                    <div class="footer-nav">
                        <a href="#">Home</a>
                        <a href="#">Portfolio</a>
                        <a href="#">Pages</a>
                        <a href="#">Shortcode</a>
                        <a href="#">Blog</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</footer>


        
    </div>

    <!--Required JS files-->
<script src="assets/js/jquery-2.2.4.min.js"></script>
<script src="assets/js/vendor/popper.min.js"></script>
<script src="assets/js/vendor/bootstrap.min.js"></script>
<script src="assets/js/vendor/owl.carousel.min.js"></script>
<script src="assets/js/vendor/isotope.pkgd.min.js"></script>
<script src="assets/js/vendor/jquery.barfiller.js"></script>
<script src="assets/js/vendor/loopcounter.js"></script>
<script src="assets/js/vendor/slicknav.min.js"></script>
<script src="assets/js/active.js"></script>

</body>

</html>
